<template>
  <div style="padding:10px 10px">
    <div class="topMenu" style="padding-bottom: 10px">
      <div class="formbtn">
        <list-search :cols="columns" @search="searchParamChange"/>
        <el-button size="small" type="primary" @click="uploadform" style="margin:2px 0 0 5px;height:30px">点击上传</el-button>
        <!-- <el-button type="text" @click="open">点击打开 Message Box</el-button> -->
      </div>
    </div>
    <d2-crud
      ref="d2Crud"
      :columns="columns"
      :data="dataList"
      :rowHandle="rowHandle"
      :options="options"
      index-row
      selection-row
      @selection-change="selectChange"
      @row-click="rowClick"
      @del-model="evidecedel"
      @open-model="evideceOpen"
    ></d2-crud>
    <eveidence-info v-model="detailVisible" ref="eveidenceinfo" @upload="getTableData"/>
  </div>
</template>
<script>
  import dictCache from "@/assets/utils/cache-dict-util";
  import utils from '@/assets/utils/zhzf-util';
  import {mapActions} from "vuex";
  import eveidenceInfo from "./eveidenceform";
  import caseApi from "@/api/system/case";
  import headBtns from "@/views/comps/zhzf/head-btns";
  import ListSearch from "../../comps/zhzf/list-search";
  import moment from 'moment';

  export default {
    components: {headBtns, eveidenceInfo, ListSearch},
    data() {
      return {
        labelPosition: "right",
        from: {},
        dataList: [],
        fileList: [],
        selected: [],
        detailVisible: false,
        doUpload: '/api/up/file',
        pppss: {
          srid: ''
        },
        options: {
          stripe: true,
          highlightCurrentRow: true
        },
        columns: [
          {title: "证据名称", key: "fileRealName"},
          {title: "附件类型", key: "fileExtension", width: 100},
          // { title: "证据类型", key: "fileRealName"},
          {title: "上传人", key: "createName", width: 100},
          {
            title: "上传时间", key: "createTime", width: 150, formatter: (row, col, val) => {
              if (val) {
                val = moment(val).format('YYYY-MM-DD HH:mm:ss')
              } else {
                val = '---'
              }
              return val;
            }
          },
          {title: "大小", key: "fileSize", width: 100,formatter: (row, col, val) => {
              if (val) {
                val = (val/(1024*1024)).toFixed(3)+'m';
              } else {
                val = '0'
              }
              return val;
            }},
        ],
        rowHandle: {
          custom: [
            {text: '删除', emit: 'del-model', style: "color:#409eff;text-decoration:underline;font-size:14px;"},
            {text: '打开', emit: 'open-model', style: "color:#409eff;text-decoration:underline;font-size:14px;"},
          ]
        },
      };
    },

    mounted() {
    },
    methods: {
      ...mapActions("d2admin/page", ["close"]),
      async initPage(detail, distData) {
        this.from = detail;
        await this.getTableData(detail);
      },
      evideceOpen(rd){
        let row = rd.row;
        let url = new window.URL(`${process.env.VUE_APP_API}/zhzf${row.fileLocation}`)
        let link = document.createElement('a')
        link.style.display = 'none'
        link.setAttribute('target', '_blank')
        link.href = url
        document.body.appendChild(link)
        link.click()
      },
      rowClick(row) {
        let els = this.$refs.d2Crud.$children;
        this.$refs.d2Crud.$children[els.length == 1 ? 0 : els.length - 2].toggleRowSelection(row);
      },
      selectChange(selection) {
        this.selected = selection;
      },
      async getTableData(data) {
        if(data&&data.caseAccessId){
          let res = await caseApi.filelist({caseAccessId: data.caseAccessId});
          this.dataList = res.data;
        }
      },

      uploadform() {
        this.detailVisible = true;
        this.$refs.eveidenceinfo.initPage(this.from);
      },
      async searchParamChange(query) {
        console.log(this.dataList, query.fileRealName);
      },
      async evidecedel(row) {
        this.$confirm("确认删除？", "确认信息", {
          distinguishCancelAndClose: true,
          confirmButtonText: "删除",
          cancelButtonText: "取消"
        }).then(async () => {
          let eveidenceid = [];
          eveidenceid.push(row.row.evidenceId);
          let res = await caseApi.delfilelist(eveidenceid);
          this.getTableData({caseAccessId: this.from.caseAccessId});
          if (res.ok) {
            utils.showTips('刪除成功');
          }
        })
      .catch(() => {});
      },
    }
  };
</script>
<style lang="scss">
</style>
